import { createRouter, createWebHistory } from "vue-router";

const routes = [
	{
		path: "/",
		name: "Home",
		component: () => import("../views/Home/index.vue"),
	},
	{
		path: "/editor",
		name: "Editor",
		component: () => import("../views/EditorView/index.vue"),
	},
	{
		path: "/materials",
		name: "Materials",
		redirect: "/select-group",
		component: () => import("../views/MaterialsView/index.vue"),
		children: [
			{
				path: "/select-group",
				name: "SelectGroup",
				component: () => import("../views/MaterialsView/SelectGroupView.vue"),
				children: [
					{
						path: "/single-select",
						name: "SingleSelect",
						component: () =>
							import(
								"../components/SurveyComs/Materials/SelectComs/SingleSelect.vue"
							),
					},
					{
						path: "/option-select",
						name: "OptionSelect",
						component: () =>
							import(
								"../components/SurveyComs/Materials/SelectComs/OptionSelect.vue"
							),
					},
					{
						path: "/multi-select",
						name: "MultiSelect",
						component: () =>
							import(
								"../components/SurveyComs/Materials/SelectComs/MultiSelect.vue"
							),
					},
					{
						path: "/single-pic-select",
						name: "SinglePicSelect",
						component: () =>
							import(
								"../components/SurveyComs/Materials/SelectComs/SinglePicSelect.vue"
							),
					},
					{
						path: "/multi-pic-select",
						name: "MultiPicSelect",
						component: () =>
							import(
								"../components/SurveyComs/Materials/SelectComs/MultiPicSelect.vue"
							),
					},
				],
			},
			{
				path: "/input-group",
				name: "InputGroup",
				component: () => import("../views/MaterialsView/InputGroupView.vue"),
			},
			{
				path: "/advanced-group",
				name: "advanced-group",
				component: () => import("../views/MaterialsView/AdvancedGroupView.vue"),
			},
			{
				path: "/note-group",
				name: "note-group",
				component: () => import("../views/MaterialsView/NoteGroupView.vue"),
			},
			{
				path: "/personal-info-group",
				name: "personal-info-group",
				component: () =>
					import("../views/MaterialsView/PersonalInfoGroupView.vue"),
			},
			{
				path: "/contact-group",
				name: "contact-group",
				component: () => import("../views/MaterialsView/ContactGroupView.vue"),
			},
		],
	},
];

const router = createRouter({
	history: createWebHistory(),
	routes,
	linkExactActiveClass: "router-link-exact-active", // 精确匹配的激活类名
	linkActiveClass: "router-link-active", // 包含匹配的激活类名
});

export default router;
